<template>
  <div>
    <el-dialog title="变卖详情" :visible.sync="$parent.open" width="70%">
      <div class="center_dialog">
        <el-divider>申请信息</el-divider>
        <el-descriptions :colon="false" title="" direction="vertical" :column="4" border>
          <el-descriptions-item label="申请单号">{{ allocation.disposalNum || '-' }}</el-descriptions-item>
          <el-descriptions-item label="申请时间">{{ allocation.applicationTime || '-' }}</el-descriptions-item>
          <el-descriptions-item label="申请人">{{ allocation.applicantName || '-' }}</el-descriptions-item>
          <el-descriptions-item label="变卖原因">{{ allocation.reason || '-' }}</el-descriptions-item>
        </el-descriptions>
        <el-divider>相关附件</el-divider>
        <el-link :disabled="!allocation.file" type="primary" icon="el-icon-document" :href="allocation.file"
          target="_blank">附件资料</el-link>
        <el-divider>调拨列表</el-divider>
        <el-table :data="allocation.disposalEquipmentAccountVos">
          <el-table-column prop="eaPartInfoVo.equipmentNum" label="设备编号" width="120"></el-table-column>
          <el-table-column prop="eaPartInfoVo.equipmentName" label="设备名称" width="120"></el-table-column>
          <el-table-column prop="eaPartInfoVo.model" label="规格型号"></el-table-column>
          <el-table-column prop="eaPartInfoVo.typeName" label="类别"></el-table-column>
          <el-table-column prop="deptName" label="所属部门"></el-table-column>
          <el-table-column prop="oldHeadName" label="是否报废">
            <template slot-scope="scope">
              {{ scope.row.userStatus === '3' ? '是' : '否' }}
            </template>
          </el-table-column>
          <el-table-column prop="eaPartInfoVo.purchaseTime" label="购置日期"></el-table-column>
          <el-table-column label="设备状态">
            <template slot-scope="scope">
              <dict-tag :options="statusAllocation" :value="scope.row.status" />
            </template>
          </el-table-column>
          <el-table-column prop="userStatusName" label="使用状态"></el-table-column>
        </el-table>
        <el-divider>审核流程</el-divider>
        <div class="accep_flex" align="center">
          <el-steps space="80px" finish-status="success" direction="vertical">
            <el-step status="success" title="开始" icon="el-icon-s-help" :description="rowObj.applicationTime">
            </el-step>
            <el-step v-for="(item, index) in allocation.auditVos" :key="index"
              :status="['wait', 'wait', 'success', 'error'][item.status]" :title="item.userName || '-'"
              icon="el-icon-s-help" :description="item.auditTime || '-'" v-show="item.userType === '0'"></el-step>
            <el-step :status="islength ? 'success' : 'wait'" title="结束" icon="el-icon-s-help">
            </el-step>
          </el-steps>
        </div>
      </div>
      <div align="center" slot="footer" class="dialog-footer">
        <el-button @click="() => $parent.open = false">关闭</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import { getChlidrenSale } from '@/api/management/management.js'
export default {
  props: ['rowObj'],
  data () {
    return {
      auditData: [],
      islength: true,
      allocation: {},
      gridData: []
    }
  },
  created () {
    this.getlist()
  },
  methods: {
    /**
     * 初始化
     */
    getlist () {
      getChlidrenSale(this.rowObj.disposalId).then(res => {//详情接口
        this.allocation = res.data
        for (let index = 0; index < res.data.auditVos.length; index++) {
          const element = res.data.auditVos[index];
          if (element.status !== '2' && element.userType === '0') {//获取当前节点 //未通过，并且为审核人
            this.islength = false
          }
        }
      })

    }
  }
}
</script>

<style lang="scss" scoped>
.center_dialog {
  // text-align: center;
  width: 80%;
  // padding: 0 10% 0 10%;
  box-sizing: border-box;
  margin: 0px auto;
}

.accep_flex {
  display: flex;
  justify-content: center;
  align-items: center;
}
</style>